<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
    <meta name="author" content="何毓堂">
    <title></title>
    <link rel="stylesheet" href="base.css">
    <link rel="stylesheet" href="index.css">
</head>

<body>
    <!-- 导航栏 -->
    <nav class="nav">
        <div class="container nav-container">
            <ul class="nav-left">
                <li class="active"><a href="#">首页</a></li>
                <li><a href="#">所有分类</a></li>
                <li><a href="#">设计创意</a></li>
                <li><a href="#">办公创意</a></li>
                <li><a href="#">···</a></li>
            </ul>
            <ul class="nav-right">
                <li class="vip"><a href="#"><span>VIP中心</span></a></li>
                <li class="login"><a href="#">请登录</a></li>
                <li class="register"><a href="#">免费注册</a></li>
            </ul>
        </div>
    </nav>

    <!-- 头部 -->
    <div class="container">
        <header>
            <a href="#"><img src="./img/logo-x.png" alt=""></a>
            <ul class="search">
                <li class="search-list">
                    <a href="#">全站</a>
                    <input type="text" placeholder="800万免费设计素材任意下载">
                    <a href="#"><span></span></a>
                </li>
                <li class="search-info">
                    热门搜索：
                    <a href="#">七夕</a>
                    <a href="#">详情页</a>
                    <a href="#">icon</a>
                    <a href="#">主图</a>
                    <a href="#">秋季</a>
                    <a href="#">PPT模板</a>
                    <a href="#">EXECL模板</a>
                    <a href="#">首页</a>
                    <a href="#">个人简历</a>
                    <a href="#">装饰画</a>
                </li>
            </ul>
        </header>
    </div>

    <!-- 轮播图 -->
    <div class="banner">
        <div class="container banner-info">
            <ul class="img-list">
                <li class="current"><a href="#"><img src="img/banner01.jpg" alt=""></a></li>
                <li><a href="#"><img src="img/banner02.jpg" alt=""></a></li>
                <li><a href="#"><img src="img/banner03.jpg" alt=""></a></li>
                <li><a href="#"><img src="img/banner04.jpg" alt=""></a></li>
                <li><a href="#"><img src="img/banner05.jpg" alt=""></a></li>
                <li><a href="#"><img src="img/banner06.jpg" alt=""></a></li>
                <li><a href="#"><img src="img/banner07.jpg" alt=""></a></li>
                <li><a href="#"><img src="img/banner08.jpg" alt=""></a></li>
            </ul>
            <ul class="indicator">
                <li class="active"><a href="#"></a></li>
                <li><a href="#"></a></li>
                <li><a href="#"></a></li>
                <li><a href="#"></a></li>
                <li><a href="#"></a></li>
                <li><a href="#"></a></li>
                <li><a href="#"></a></li>
                <li><a href="#"></a></li>
            </ul>
        </div>
        <a href="#" class="img-btn prev"></a>
        <a href="#" class="img-btn next"></a>
    </div>

    <!-- 精选专题 -->
    <div class="container">
        <div class="jxzt content-box">
            <div class="content-title">
                <h2>精选专题</h2>
                <ul>
                    <li><a href="#">100万党建素材、PPT汇报模板无限下载，每天仅需0.18元立享VIP特权</a></li>
                    <li><a href="#">更多 >></a></li>
                </ul>
            </div>
            <ul class="content-list">
                <li>
                    <a href="#">
                        <img src="img/jxzt01.jpg" alt="">
                        <div class="corver"></div>
                        <div class="corver-info">
                            <h3>爱的元素背景</h3>
                            <p>牛郎织女，鹊桥相会</p>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="img/jxzt02.jpg" alt="">
                        <div class="corver"></div>
                        <div class="corver-info">
                            <h3>爱的元素背景</h3>
                            <p>牛郎织女，鹊桥相会</p>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="img/jxzt03.jpg" alt="">
                        <div class="corver"></div>
                        <div class="corver-info">
                            <h3>爱的元素背景</h3>
                            <p>牛郎织女，鹊桥相会</p>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="img/jxzt04.jpg" alt="">
                        <div class="corver"></div>
                        <div class="corver-info">
                            <h3>爱的元素背景</h3>
                            <p>牛郎织女，鹊桥相会</p>
                        </div>
                    </a>
                </li>
            </ul>
        </div>
    </div>
    <!-- 商用海报 -->
    <div class="container">
        <div class="syhb content-box">
            <div class="content-title">
                <h2>商用海报</h2>
                <ul>
                    <li><a href="#">100万党建素材、PPT汇报模板无限下载，每天仅需0.18元立享VIP特权</a></li>
                    <li><a href="#">更多 >></a></li>
                </ul>
            </div>
            <ul class="content-list">
                <li>
                    <a href="#">
                        <img src="img/syhb01.jpg" alt="">
                        <div class="corver"></div>
                        <div class="corver-info">
                       <ul>
                            <li>
                            <a href="#">
                            <div class="download"></div>
                            <p>75</p>
                            </a>
                </li>
                <li>
                    <a href="#">
                        <div class="heart"></div>
                        <p>45</p>
                    </a>
                </li>
            </ul>
        </div>
        </a>
        </li>
        <li>
            <a href="#">
            <img src="img/syhb01.jpg" alt="">
            <div class="corver"></div>
            <div class="corver-info">
            <ul>
              <li>
                <a href="#">
                <div class="download"></div>
                <p>75</p>
                </a>
              </li>
        <li>
            <a href="#">
                <div class="heart"></div>
                <p>45</p>
            </a>
        </li>
        </ul>
    </div>
    </a>
    </li>
    <li>
        <a href="#">
        <img src="img/syhb01.jpg" alt="">
        <div class="corver"></div>
        <div class="corver-info">
        <ul>
            <li>
                <a href="#">
                <div class="download"></div>
                <p>75</p>
                </a>
            </li>
    <li>
        <a href="#">
            <div class="heart"></div>
            <p>45</p>
        </a>
    </li>
    </ul>
    </div>
    </a>
    </li>
    <li>
        <a href="#">
    <img src="img/syhb01.jpg" alt="">
            <div class="corver"></div>
     <div class="corver-info">
     <ul>
        <li>
          <a href="#">
          <div class="download"></div>
           <p>75</p>
          </a>
    </li>
    <li>
        <a href="#">
            <div class="heart"></div>
            <p>45</p>
        </a>
    </li>
    </ul>
    </div>
    </a>
    </li>
    </ul>
    </div>
    </div>
    <footer>
        <div class="bottom">
            <div class="bottom-left">
                <div>
                    <span>常见问题</span>
                    <ul>
                        <li> <a href="#">成为特邀设计师</a> </li>
                        <li> <a href="#">成为原创贡献者</a> </li>
                        <li> <a href="#">注册登录</a> </li>
                        <li> <a href="#">账号/密码</a> </li>
                        <li> <a href="#">充值/售后</a> </li>
                        <li> <a href="#">版权投诉</a> </li>
                    </ul>
                </div>
                <div><span>关于千图网</span>
                    <ul>
                        <li> <a href="#">关于我们</a> </li>
                        <li> <a href="#">媒体报道</a></li>
                        <li> <a href="#">加入我们</a></li>
                        <li> <a href="#">心系千图</a></li>
                        <li> <a href="#">每日最新</a></li>
                    </ul>
                </div>
                <div><span>产品服务</span>
                    <ul>
                        <li><a href="#">官方博客</a></li>
                        <li><a href="#">帮助中心</a></li>
                        <li><a href="#">前途导航</a></li>
                    </ul>
                </div>
                <div><span>友情链接</span>
                    <ul>
                        <li><a href="#">我图网</a></li>
                        <li><a href="#">千库网</a></li>
                        <li><a href="#">摄图网</a></li>
                        <li><a href="#">包图网</a></li>
                        <li><a href="#">视达网</a></li>
                        <li><a href="#">更多>></a></li>
                    </ul>
                </div>
            </div>
            <div class="bottom-right">
                <strong>客服质询</strong>
                <div class="phone"><i></i>400-998-7011 （9:00-18:00）</div>
                <div class="email"><i></i><a href="#">feedback@58pic.com</a></div>
                <div class="qq"><i></i><span>点我交谈</span></div>
            </div>
        </div>
        <div class="over">
            <div class="over-left">
                <i class="wb"></i>
                <i class="wx"></i>
                <span><a href="#">注册声明</a></span>
                <span><a href="#">版权声明</a></span>
                <span><a href="#">售后服务</a></span>
            </div>
            <div class="over-right">
                <span>Copyright 2013-2017 千图网 沪ICP备10011451号-6 <i></i>上海工商 安全实名验证 信用网站</span>
            </div>
        </div>
    </footer>



    <script src="index.js"></script>
</body>

</html>
<script>

</script>